<html>
	<head>
		<script type="text/javascript" src="../lib/jquery-1.4.4.min.js"></script>
		<script type="text/javascript" src="../lib/jqXMLUtils.js"></script>
		<script type="text/javascript" src="../lib/sylvester.js"></script>
		<script type="text/javascript" src="../lib/utilities.js"></script>
		<!-- GAME CLASSES -->
		<script type="text/javascript" src="./gamesetupxmlreader.js"></script>
		<script type="text/javascript" src="./patternpole.js"></script>
		<script type="text/javascript" src="./pattern.js"></script>
		<script type="text/javascript" src="./gameengine.js"></script>
		<script type="text/javascript" src="./gameplay.js"></script>
		<script type="text/javascript" src="./patternpath.js"></script>
		<script type="text/javascript" src="./gamecreator.js"></script>
		<script type="text/javascript" src="./reporter.js"></script>
		
		<script type="text/javascript">
		$(document).ready(function(){
		var gameCreator = new GameCreator({canvas:document.getElementById("example")});
		});
		</script>
	</head>
	<body>
		<div>
			<h1>PatterNBack</h1>
			<h3>Instructions<input id="instrClick" type="button" value="+"></input></h3>
			<div  id="instructions">
			<table>
				<tbody>
					<tr>
						<td style="border:1px solid grey;">
							<ul>
								<li>Match green and red patterns to make a complete square.</li>
								<li>Turn the green pattern with arrow buttons or with Q/A.</li>
								<li>Select matching pattern with up or space.</li>
								<li>The first N hidden pattern-pairs are rotated to match.</li>
							</ul>
						</td>
					</tr>
				</tbody>
			</div>				
			</table>
		</div>
		<table border="1">
		<tbody>
		<tr>
		<td>
			<input id="newGame" type="button" value="Start [space/up]"></input>
			<input id="resetScores" type="button" value="Reset scores"></input>
			<input id="gameAbort" type="button" value="Abort turn"></input>
		</tr>
		<tr>
		<td>
		<canvas id="example" width="0" height="0" style="">
		This text is displayed if you have chosen the dark side.
		Your browser does not support HTML5 Canvas.
		</canvas>
		</td>
		</tr>
		</tbody>
		</table>
	</body>
</html>